<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0">
    <title>购物车</title>
    <link rel="stylesheet" href="./css/04-shopping-cart.css">
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
</head>
<body>
    <div class="parent">
    <div class="top">
        <span class="left">&lt;</span>
        <span class="right">购物车</span>
    </div>
    <div class="top-main">
        <div class="son1">
            <input type="checkbox">
            <img src="./img/04-shopping-chart/01.png" alt="">
            <div class="son-1">
                <h4>幸福守候</h4>
                <p>数量：<span>x 1</span></p>
                <p>市场价：<span style="text-decoration: line-through;opacity: 0.5;">￥299</span></p>
                <p>店铺价：<span style="color: red;">￥239</span></p>
            </div>
        </div>
        <div class="son2">
            <input type="checkbox">
            <img src="./img/04-shopping-chart/02 .png" alt="">
            <div class="son-2">
                <h4>浪漫满屋</h4>
                <p>数量：<span>x 1</span></p>
                <p>市场价：<span style="text-decoration: line-through;opacity: 0.5;">￥289</span></p>
                <p>店铺价：<span style="color: red;">￥229</span></p>
            </div>
        </div>
        <div class="son3">
            <input type="checkbox">
            <img src="./img/04-shopping-chart/03.png" alt="">
            <div class="son-3" style="border-bottom:3vw grey;">
                <h4>永恒回忆</h4>
                <p>数量：<span>x 1</span></p>
                <p>市场价：<span style="text-decoration: line-through;opacity: 0.5;">￥399</span></p>
                <p>店铺价：<span style="color: red;">￥329</span></p>
            </div>
        </div>
    </div>
    <div class="main">
        <div class="main-top">
            <p>猜你喜欢</p>
        </div>
        <div class="main-1">
            <img src="./img/04-shopping-chart/1.png" alt="">
                <p>永恒回忆</p>
                <span style="color: red;margin-left: 2.6667vw;">￥329</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量16022笔</span>
        </div>
        <div class="main-2">
            <img src="./img/04-shopping-chart/2 .png" alt="">
                <p>浪漫满屋</p>
                <span style="color: red;margin-left: 2.6667vw;">￥229</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量17229笔</span>
        </div>
        <div class="main-3">
            <img src="./img/04-shopping-chart/3.png" alt="">
                <p>幸福守候</p>
                <span style="color: red;margin-left: 2.6667vw;">￥239</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量15632笔</span>
        </div>
        <div class="main-4">
            <img src="./img/04-shopping-chart/4.png" alt="">
                <p>缘分天空</p>
                <span style="color: red;margin-left: 2.6667vw;">339</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量13960笔</span>
        </div>
        <div class="main-5">
            <img src="./img/04-shopping-chart/5.png" alt="">
                <p>相濡以沫</p>
                <span style="color: red;margin-left: 2.6667vw;">￥229</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量12658笔</span>
        </div>
        <div class="main-6">
            <img src="./img/04-shopping-chart/6.png" alt="">
                <p>此生不渝</p>
                <span style="color: red;margin-left: 2.6667vw;">￥168</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量16256笔</span>
        </div>
        <div class="main-7">
            <img src="./img/04-shopping-chart/7.png" alt="">
                <p>浪漫告白</p>
                <span style="color: red;margin-left: 2.6667vw;">￥329</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量19578笔</span>
        </div>
        <div class="main-8">
            <img src="./img/04-shopping-chart/8.png" alt="">
                <p>为你心动</p>
                <span style="color: red;margin-left: 2.6667vw;">￥329</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量16877笔</span>
        </div>
        <div class="main-9">
            <img src="./img/04-shopping-chart/9.png" alt="">
                <p>满天繁星</p>
                <span style="color: red;margin-left: 2.6667vw;">￥299</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量14598笔</span>
        </div>
        <div class="main-10">
            <img src="./img/04-shopping-chart/10.png" alt="">
                <p>不忘初心</p>
                <span style="color: red;margin-left: 2.6667vw;">￥189</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量10548笔</span>
        </div>
        <div class="main-11">
            <img src="./img/04-shopping-chart/11.png" alt="">
                <p>情定今生</p>
                <span style="color: red;margin-left: 2.6667vw;">￥699</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量13845笔</span>
        </div>
        <div class="main-12">
            <img src="./img/04-shopping-chart/12.png" alt="">
                <p>真心真意</p>
                <span style="color: red;margin-left: 2.6667vw;">￥339</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量12856笔</span>
        </div>
        <div class="main-13">
            <img src="./img/04-shopping-chart/13.png" alt="">
                <p>感恩的心</p>
                <span style="color: red;margin-left: 2.6667vw;">￥159</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量13669笔</span>
        </div>
        <div class="main-14">
            <img src="./img/04-shopping-chart/14 .png" alt="">
                <p>挚爱一生</p>
                <span style="color: red;margin-left: 2.6667vw;">￥189</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量9856笔</span>
        </div>
        <div class="main-15">
            <img src="./img/04-shopping-chart/15.png" alt="">
                <p>温暖阳光</p>
                <span style="color: red;margin-left: 2.6667vw;">￥269</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量12710笔</span>
        </div>
        <div class="main-16">
            <img src="./img/04-shopping-chart/16.png" alt="">
                <p>情有独钟</p>
                <span style="color: red;margin-left: 2.6667vw;">￥689</span>
                <span style="margin-left: 11vw;opacity: 0.5;">销量9877笔</span>
        </div>
    </div>
    <div class="bottom">
        <div class="left"><p>合计： ¥ 0</p></div>
        <div class="right"><p>去结算(0)</p></div>
    </div>
</div>
</body>
</html>